<template>
    <transition
      name="custom-classer-transition"
      enter-active-class="animated fadeInDown"
      leave-active-class="animated fadeOutUp"
    >
      <div class="modal-ctrl-body" v-show="AddPoliceModalObj.isShow"
      >
        <div class="modal-ctrl-main even-row-ctrl">
          <tableMatePolice
              class="table-mate-police"
              :header-table="headerTable"
              :table-data="policePageList"
              :tableMateData="tableMateData"
              :clearCheckedAry="clearCheckedAry"
              @checkedAryFn="checkedAryFn">
          </tableMatePolice>
          <div class="btns text-r">
            <button type="button" class="btn btn-default"  @click="close">取消</button>
            <button type="button" class="btn btn-info" @click="subBtn">确定</button>
          </div>
        </div>
      </div>
    </transition>
</template>

<script>
  import tableMatePolice from "./tableMatePolice";
  export default {
    name: "addPoliceModal",
    props:["AddPoliceModalObj","tableMateData"],
    data(){
      return {
        ModalData: {

        },
        // 表单头部
        headerTable: [
          { "name" : "姓名" },
          { "name" : "电话" },
          { "name" : "手台" },
          {"name" : "职位" },
          {"name" : "排序" }
        ],
        policePageList: [],
        clearCheckedAry: false,
        // 给警员批量授予相应的细分部门关系的数组
        tableIds: []
      }
    },
    components:{
      tableMatePolice
    },
    methods: {
      //关闭弹窗
      close(){
        this.$emit("addPoliceClose");
        this.clearData(); //关闭弹窗清除数据
      },
      //提交
      subBtn(){
        if(this.tableIds == []){
          this.s_alert('请先选择需要添加的警员！');
          // alert('请先选择需要添加的警员！');
          return false;
        }
        this.$axios.post(baseURL+'api/jp-HCZZ-AdminWeb-app-ms/addressbook/policepart/addralationbatch/'+this.AddPoliceModalObj.stationId,this.tableIds)
          .then(res => {
            this.s_alert('新增成功');
            // alert('新增成功');
            this.close()
          }).catch(err=>{
            this.s_alert("新增失败");
            // alert("新增失败");
        })
      },
      clearData(){
        this.clearCheckedAry = !this.clearCheckedAry
      },
      checkedAryFn(tableIds){
        this.tableIds = tableIds;
        //console.log(tableIds)
      },
      // 查询全部警员
      findAllPolice(){
        this.$axios.get(baseURL+'api/jp-HCZZ-AdminWeb-app-ms/addressbook/maillist/findallpolice')
          .then(res => {
            this.policePageList = res.data;
            //console.log(res.data)
          })
      },
      // 查询归属部门的警员
      findPoliceByStationId(stationId){
        this.$axios.get(baseURL+'api/jp-HCZZ-AdminWeb-app-ms/addressbook/maillist/findpolicebystationid?stationId='+stationId)
          .then(res => {
            this.policePageList = res.data;
            //console.log(res.data)
          }).catch(err=>{
            //console.log(err);
        })
      },
    },
    watch:{
      AddPoliceModalObj:{
        handler: function (val){
          // 显示弹窗，且弹窗没有传入id则是查询全部警员
          if(val.isShow && val.btnType === 'findAllPolice'){
            this.findAllPolice();
          }
          // 显示弹窗，且弹窗传入id则是查询归属部门的警员
          else if(val.isShow && val.btnType === 'findPoliceByStationId'){
            this.findPoliceByStationId(val.partId)
          }
        },
        deep: true
      }
    }
  }
</script>

<style scoped>
  .input-number {
    width: 60%;
  }
  .table-mate-police {
    height: 420px;
  }
  .btns {
    margin-top: 16px;
  }
</style>
